<template>
  <!-- 修改密码 -->
  <el-form ref="ruleFormRef" :model="ruleForm" status-icon label-width="100px" label-position="left" class="demo-ruleForm">
    <el-form-item label="原密码" prop="oldPassword">
      <el-input v-model="ruleForm.oldPassword" type="password" autocomplete="off" />
    </el-form-item>

    <el-form-item label="新密码" prop="newPassword">
      <el-input v-model="ruleForm.newPassword" type="password" autocomplete="off" />
    </el-form-item>

    <el-form-item label="确认密码" prop="checkPass">
      <el-input v-model="ruleForm.checkPass" type="password" autocomplete="off" />
    </el-form-item>

    <el-form-item>
      <el-button @click="resetForm(ruleFormRef)">取消</el-button>

      <el-button type="text" @click="open">
        <el-button type="primary">确认</el-button>
      </el-button>
    </el-form-item>
  </el-form>
</template>

<script>
import Cookies from 'js-cookie' // 引入cookie
import { post } from '@/utils/http.js' // 引入封装工具

export default {
  data () {
    return {
      ruleForm: {
        _gp: 'admin',
        _mt: 'newPassword',
        oldPassword: '',
        newPassword: '',
        checkPass: ''
      }
    }
  },

  methods: {
    // 修改
    open () {
      ElMessageBox.confirm('确认修改?', '提示', {
        confirmButtonText: '确认',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          if (this.ruleForm.oldPassword.length == 0) {
            ElMessage.warning('请输入原密码')
            return
          }
          if (this.ruleForm.newPassword.length == 0) {
            ElMessage.warning('请输入新密码')
            return
          }
          if (this.ruleForm.newPassword != this.ruleForm.checkPass) {
            ElMessage.warning('两次密码输入不一致')
            return
          }
          // Qs转换数据类型
          const data = this.ruleForm

          // this.axios
          //   .post("http://192.168.1.188:8080/m.api", data, {
          //     headers: {
          //       AdminToken: Cookies.get("token"),
          //     },
          //   })
          post(data).then((res) => {
            if (res.data.errno == 200) {
              // 判断data里的值是否返回正确 清空返回登录
              sessionStorage.removeItem('token')
              Cookies.remove('token')
              this.$router.push('/Login') // 返回登录页面
            } else {
              ElMessage.error(res.data.errmsg)
            }
          })

          // 确认提示
          ElMessage({
            type: 'success',
            message: '修改成功！'
          })
        })
        .catch(() => {
          ElMessage({
            type: 'info',
            message: '取消操作！'
          })
        })
    },

    // 取消
    resetForm (formEl) {
      if (!formEl) return
      formEl.resetFields()
    }
  }
}
</script>

<style lang="less" scoped>
.demo-ruleForm {
  margin: auto;
  width: 30%;
}
</style>
